<template>

	<g  @contextmenu.stop="itemRightClick($event,stateDesc,isMainPage,name,'bileiqi')"
			:transform="'translate(' + translateX + ',' + translateY + ')rotate('+ rotate +')scale('+scale+')'" class="cursor-pointer"
	>
		<!-- 避雷器的 SVG 图形 -->
		<g>
			<line x1="130" y1="97" x2="142" y2="97" :style="{stroke:'rgb(255,0,0)',strokeWidth:2}" />
			<g transform="translate(-20,0)">
				<line x1="162" y1="97" x2="175" y2="97" :style="{stroke:'rgb(255,0,0)',strokeWidth:2}" />
				<line x1="175" y1="97" x2="170" y2="92" :style="{stroke:'rgb(255,0,0)',strokeWidth:2}" />
				<line x1="175" y1="97" x2="170" y2="102" :style="{stroke:'rgb(255,0,0)',strokeWidth:2}" />
				<rect x="162" y="92" width="20" height="10" :style="{stroke:'rgb(255,0,0)',fill: 'transparent'}" />
				<line x1="188" y1="91" x2="188" y2="103" :style="{stroke:'rgb(255,0,0)',strokeWidth:2}" />
				<line x1="192" y1="92" x2="192" y2="102" :style="{stroke:'rgb(255,0,0)',strokeWidth:2}" />
				<line x1="182" y1="97" x2="195" y2="97" :style="{stroke:'rgb(255,0,0)',strokeWidth:2}" />
			</g>
		</g>
	</g>
</template>

<script>
export default {
	name: "biLeiQi",
	props: {
		translateX: { type:  [Number,String], default: 0 },
		translateY: { type:  [Number,String], default: 0 },
		rotate: { type:  [Number,String], default: 0 },
		scale: { type:  [Number,String], default: 1 },
		name: { type: String, default: '' },
		stateDesc:{
			type: String,
			default: ""
		},
		color: { type: String, default: '#619fd2' },
		isMainPage:{
			type: Boolean,
			default: false


	},

},
	methods: {
		itemRightClick(event,stateDesc,isMainPage,name,type) {
			event.preventDefault(); // 阻止默认的右键菜单弹出
			// 显示自定义右键菜单
			const {clientX, clientY} = event
			let params = {
				clientX,
				clientY,
				type,
				stateDesc,
				isMainPage,
				deviceName:name,
			}

			this.$emit('itemRightClick', params)
		},
	},
}
</script>

<style lang="less" scoped>
.cursor-pointer {
	cursor: pointer;
}
</style>
